<template>
  <a-modal :open="open" width="1200px" title="医师工作量明细查询" centered :keyboard="false" :footer="false" @cancel="onCancel">
    <div class="flex items-center border p-2 mb-3" style="border-color: var(--primary-color)">
      <img :src="avatarMan" alt="" />
      <div class="mx-10 text-base font-bold">{{ formState.empName }}</div>
      <div>{{ formState.sex }}</div>
      <div class="mx-10">{{ formState.ksmc }}</div>
      <div>{{ formState.phone }}</div>
    </div>
    <div class="h-[500px]">
      <BaseTable :data-source="tableData" :loading="loading" :pagination="pagination" column-code="000188" :height="400">
        <template #bodyCell="{ column, index }">
          <template v-if="column.dataIndex === 'xh'">
            {{ index + 1 }}
          </template>
        </template>
      </BaseTable>
    </div>
  </a-modal>
</template>

<script setup>
import { ref, watch } from 'vue'
import BaseTable from '@/components/BaseTable'
import avatarMan from '@/assets/images/avatar-man.png'

const props = defineProps({
  open: Boolean,
  rowData: {
    type: Object,
    default: () => ({})
  }
})
const emit = defineEmits(['update:open'])

const formState = ref({})

const { loading, pagination, getData, tableData } = useTable({
  url: '/lis/LisApply/getLisReportList',
  formatParams: () => {
    return {
      ...formState.value,
      stdate: formState.value?.dateRange?.[0],
      eddate: formState.value?.dateRange?.[1],
      status: 1
    }
  }
})

const onCancel = () => {
  emit('update:open', false)
}
watch(
  () => props.open,
  (val) => {
    if (val) {
      formState.value = props.rowData
      getData()
    }
  }
)
</script>
